<!-- iFooterVert.html -->

[%- 
btButtons = [ 	{ id = 'Album', 
					icon = 'html/images/iAlbumTrans.png', 
					selectedicon = 'html/images/iAlbumTransSelected.png', 
					namestring = 'ALBUMS', url = 'dummy' }, 
				 { id = 'Artist', 
				 	icon = 'html/images/iArtistTrans.png', 
				 	selectedicon = 'html/images/iArtistTransSelected.png', 
				 	namestring = 'ARTIST', url = 'dummy' },
				 { id = 'Playlist',
				 	icon = 'html/images/iPlaylistTrans.png',
				 	selectedicon = 'html/images/iPlaylistTransSelected.png',
				 	namestring = 'IPENG_BUTTON_LISTS', url = 'dummy' },
				 { id = 'Search',
				 	icon = 'html/images/iSearchTrans.png',
				 	selected = 'html/images/iSearchTransSelected.png',
				 	namestring = 'SEARCH', url = 'dummy' },
				 { id = 'Home',
				 	icon = 'html/images/iHomeTrans.png',
				 	selectedicon = 'html/images/iHomeTransSelected.png',
				 	namestring = 'IPENG_BUTTON_HOME', url = 'home.html?player=' _ playerURI } ];

btButtons.0.url = PROCESS browseAlbumLink;
btButtons.1.url = PROCESS browseArtistLink;
btButtons.2.url = PROCESS browsePlaylistsLink;
btButtons.3.url = PROCESS browseSearchLink;

USE iPeng;
i = 0;
context = context || 'default';
commands = iPeng.commands('toolbar', context, 5);
FOREACH command = commands;
	btButtons.$i = command;
	i = i + 1;
END;
%]

<div id = 'bottombar' [% classFooter %] selectedButton = "[% selectedButton %]" selectedContext = "[% context || 'default' %]">
[%- hasone = 0; i = 0;
	FOREACH btItem = btButtons;
		IF btItem.id == selectedButton -%]
			<div id = 'bottombarSelect' style = "left: [% i * 64 + 2 %]; display: block;"></div>
		[%	hasone = 1;
		END;
		i = i + 1;
	END;
IF !hasone; -%]
	<div id = 'bottombarSelect' style = "left: [% 2 %]; display: none;"></div>
[%- END;

-%]
<div id = 'bottombararea'>
<table width="100%" height = "48"; cellspacing = "0" cellpadding="0" border = "0">
[%- 
i = 0;
FOREACH btItem = btButtons;
	PROCESS btDisplay btid = i;
	i = i + 1;
END;

'</table>';
'</div>';
'</div>';

'<!-- /iFooterVert.html -->';


BLOCK btDisplay -%]
	<td align = "center" style = "width: 60; padding-top: 1; padding-bottom: 0;">
		<img id = "btImg[% btid %]"
			src="[% webroot;
				IF btItem.id == selectedButton && btItem.selectedicon; btItem.selectedicon; ELSE; btItem.icon; END;
			%]" style = "padding: 0; border: 0; margin: 0;"><br>
		<span id = "btText[% btid %]" class= "bottombartext[% IF btItem.id == selectedButton; 'On'; END %]">[% 
		IF btItem.namestring; btItem.namestring | string; ELSE; btItem.name; END;
		'</span>';
		IF btItem.url %]
			<a id = "btA[% btid %]" class = "bottombarClick" style = "left: [% (btid) * 64 + 2 %]" href="[%
				IF btItem.url.substr(0, 11) != 'javascript:'; webroot; END;
				btItem.url;
				IF btItem.parameters;
					FOREACH param = btItem.parameters.keys;
						'&';
						IF (btItem.parameters.$param) != "none";
							btItem.parameters.$param; '=';
						END;
						$param;
					END;
				END;
			%]" target="_self"></a>
		[%- ELSIF btItem.cli %]
			<a id = "btA[% btid %]" class = "bottombarClick" style = "left: [% (btid) * 64 + 2 %]" href="javascript:callJSONRPC(['[%
				btItem.cli; '\'';
				IF btItem.parameters;
					FOREACH param = btItem.parameters.keys;
						',\'';
						IF param.substr(0, 5) == 'other';
							btItem.parameters.$param;
						ELSE;
							IF (btItem.parameters.$param) != "none";
								btItem.parameters.$param; ':';
							END;
							$param;
						END;
						'\'';
					END;
				END;
			%]]);" target="_self"></a>
		[%- END;
	'</td>';
END;

BLOCK browseAlbumLink;
	'browsedb.html?hierarchy=album,track&level=0&&player=' _ playerURI;
END;

BLOCK browseArtistLink;
	'browsedb.html?hierarchy=contributor,album,track&level=0&&player=' _ playerURI;
END;

BLOCK browsePlaylistsLink;
	'browsedb.html?hierarchy=playlist,playlistTrack&level=0&&player=' _ playerURI;
END;

BLOCK browseSearchLink;
	'search.html?player=' _ playerURI;
END %]
